<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<script src="https://cdn.ckeditor.com/ckeditor5/39.0.2/classic/ckeditor.js"></script>
		<title></title>
	</head>
	<body>
		<div style="width: 500px;">
			<div id="editor">

			</div>
		</div>
		<button id="submitBtn" onclick="getData()">提交数据</button>
	</body>

	<script type="text/javascript">
		window.editor = null;
		ClassicEditor.create(document.querySelector('#editor'))
			.then(editor => {
				window.editor = editor;
				console.log(editor);
				//底部插入固定内容
				// editor.model.change( writer => {
				// 	console.log("xx")
				//     // Move selection to the end of the document.
				//     writer.setSelection(
				//         writer.createPositionAt( editor.model.document.getRoot(), 'end' )
				//     );

				//     // Execute the enter command.
				//     editor.execute( 'enter' );

				//     // Insert text.
				//     editor.model.change( writer => {
				//         editor.model.insertContent( writer.createText( 'The End!' ) );
				//     } );
				// } );
				editor.model.document.on('change:data', () => {
					getData()
				});
			})
			.catch(error => {
				console.error(error);
			});
		txt = null;
		function getData() {
			//文本长度

			let txtHeight = document.getElementsByClassName("ck-content")[0].clientHeight
			console.warn("高度:" + txtHeight)
			//
			let data = window.editor.getData();
			if (txtHeight > 100) {
				document.getElementById("submitBtn").disabled=true
				console.warn("高度超出预警")
				//截取内容
				
				//editor.model.document.stopListening()
				//window.editor.setData(data)
			}else{
				txt = window.editor.getData()
				document.getElementById("submitBtn").disabled=false;
			}
			
			//console.log(window.editor.getData())
		}
	</script>
</html>
